{% extends "base.html" %}
{%  block title %}图书详情页面{% endblock %}
{% block content %}
<div class="container">
    <ul class="list-group">
        <li class="list-group-item active">id：{{ book.id }}</li>
        <li class="list-group-item">书名：{{ book.name }}</li>
        <li class="list-group-item">作者：{{ book.author }}</li>
        <li class="list-group-item">在馆数量：{{ book.nums }}</li>
        <li class="list-group-item">简介：{{book.description}}</li>
    </ul>
    <!--    <a href="{% url 'bookcms:borrow' book.id %}"-->
    <!--       class="btn btn-lg {% if book.nums == 0 %}disabled btn-secondary{% else %}btn-primary{% endif %}" tabindex="-1"-->
    <!--       role="button">-->
    <!--        借书-->
    <!--    </a>-->
    <a id="book_borrow" href="{% url 'bookcms:borrow' book.id %}"></a>
    <a class="btn btn-lg {% if book.nums == 0 %}disabled btn-secondary{% else %}btn-primary{% endif %}"
            onclick="book_borrow()" value="借书">借书
    </a>
</div>

<script>
        function book_borrow() {
            // 调用layer弹窗组件
            layer.open({
                title: "确认借阅{{ book.name }}",
                content: "确认借阅?",
                yes: function(index, layero) {
                    document.getElementById("book_borrow").click();
                    layer.close(index);
                },
            })
        }
</script>
{% endblock content %}